define(['./config'], () => {
    class tab{
        constructor() {
            this.cart=document.querySelector('body')
            this.cartdiv=document.querySelector('.cartdiv>a')
            this.content=document.querySelector('.tab-list-content')
            this.Abtn=document.querySelectorAll('.tab-top>div')
            this.tiaozhuan=document.querySelector('.tiaozhuan')
           this.inint()
           
        }
        inint() {
            
        this.resert()
         this.add()
        }
        resert(){
           pAjax({
               url:'../data/list.json'
           })
           .then((res)=>{
               
               this.fengye(res)
              let data=JSON.parse(res)
              this.inCart(data)
           })
        }
        fengye(data){
            let dat=JSON.parse(data)
            let dat1=dat.slice(0,9)
            let dat2=dat.slice(9,18)
            let dat3=dat.slice(18,27)
            let dat4=dat.slice(27,36)
            let dat5=dat.slice(36,45)
           
            let datArr=[dat1,dat2,dat3,dat4,dat5]
            datArr[0].forEach((item)=>{
                this.content.innerHTML+=`
                <div class="tab-list-item">
                        <div class="status-item">
                            <span class="rank-query">${item.gameScore}</span>
                            <div class="cover-img">
                                <a class="link-des" href="produce.html?id=${item.gameId}"><img src="${item.gameIcon}"  alt=""></a>
                            </div>
                            <div class="game-info-box">
                                <div class="top-box">
                                    <div class="name-qu-box">${item.gameName}</div>
                                    <div class="game-ename">${item.gameDesc}</div>
                                </div>
                                <div class="bottom-box">
                                    <div class="tags-at-box">
                                        <div class="tag-box">${item.gameTypes}</div>
                                        <div class="pub-box">2014-9-3</div>
                                    </div>
                                    <div class="to-link-btn" data-des=${item.gameId}>加入购物车</div>
                                </div>
                            </div>
                        </div>
                        <div class="cut-off-div"></div>
                    </div>
                `
            })
            for(let i=0;i<this.Abtn.length;i++){
                this.Abtn[i].onclick=()=>{
                   
                    for (let j = 0; j < this.Abtn.length; j++) {
                        this.Abtn[j].className = 'tab-tittle'
                        
                      }
                    this.Abtn[i].className+=' active'
                    this.content.innerHTML=''
                    datArr[i].forEach((item)=>{
                        this.content.innerHTML+=`
                        <div class="tab-list-item">
                                <div class="status-item">
                                    <span class="rank-query">${item.gameScore}</span>
                                    <div class="cover-img">
                                    <a class="link-des" href="produce.html?id=${item.gameId}"><img src="${item.gameIcon}"  alt=""></a>
                                    </div>
                                    <div class="game-info-box">
                                        <div class="top-box">
                                            <div class="name-qu-box">${item.gameName}</div>
                                            <div class="game-ename">${item.gameDesc}</div>
                                        </div>
                                        <div class="bottom-box">
                                            <div class="tags-at-box">
                                                <div class="tag-box">${item.gameTypes}</div>
                                                <div class="pub-box">2014-9-3</div>
                                            </div>
                                            <div class="to-link-btn" data-des=${item.gameId}">加入购物车</div>
                                        </div>
                                    </div>
                                </div>
                                <div class="cut-off-div"></div>
                            </div>
                        `
                    })
                 
                }
            }
        }

        inCart(mydata){
         
            this.cart.addEventListener('click',e=>{
                
                e=e||window.event
                let target=e.target||e.srcElement
                console.log(target);
                if(target.className=='to-link-btn'){
                   if(document.cookie){
                    let idd = target.dataset.des-0
                    let produce=mydata.find(product=>{
                        return product.gameId==idd
                    })
                 let myList=JSON.parse(localStorage.getItem('carts'))||[]
                 if(!myList.length){
                     myList.push(produce)
                     produce.number=1
                 }else{
                     let res=myList.some(produce=>{
                         return produce.gameId==idd
                     })
                     if(res){
                         alert('亲再看看别的游戏吧')
                       
                     }else{
                         myList.push(produce)
                         produce.number=1
                     }
                 }
                 localStorage.setItem('carts',JSON.stringify(myList))
                 this.add()
                   }else{
                       alert('你还没有登录哦，先去登录吧')
                       location.href='http://127.0.0.1:2113/html/login2.html'
                   }
                    
                }
                console.log(target.className);
                if(target.className=='tiaozhuan'){
                    console.log(1);
                    if(document.cookie){
                        location.href='http://127.0.0.1:2113/html/cart.html'
                    }else{
                        alert('你还没有登录哦，先去登录吧')
                        location.href='http://127.0.0.1:2113/html/login2.html'
                    }
                }
            },false)
        }
        add(){
            let myList=JSON.parse(localStorage.getItem("carts"))
            if(myList==null){
                return
            }else{
                let num=0
                myList.forEach(item=>{
                    num+=item.number
                })
                this.cartdiv.innerHTML=num
            }
           
        }

    }
    return tab


});